// 创建路由

import VueRouter from 'vue-router';
import About from '../pages/About.vue';
import Home from '../pages/Home.vue';
import News from '../pages/News.vue';
import Messages from '../pages/Messages.vue';
import Detail from '../pages/Detail.vue';

const router = new VueRouter({
    routes: [
        {
            name: 'aboutName',
            path: '/about',
            component: About
        },
        {
            name: 'zhuye',
            path: '/home',
            component: Home,
            children: [
                {
                    name: 'xinwen',
                    path: 'news',
                    component: News,
                    meta: {
                        isAuth: true
                    },
                },
                {
                    name: 'xiaoxi',
                    path: 'messages',
                    component: Messages,
                    meta: {
                        isAuth: true
                    },
                    children: [
                        {
                            name: 'detailName',
                            //path: 'detail/:id/:title',//params占位
                            path: 'detail',
                            component: Detail,
                            //值为对象,该对象中的所有key-value都会以props的形式传给Detail组件
                            //props:{a:1,b:'hello'},
                            //值为bool值，若为真，就会把路由组件收到的所有params参数，以props的形式传给detail组件
                            // props:true,
                            // 值为函数,以props的形式传给Detail组件
                            // props($route) {
                            //     return { id: $route.query.id, title: $route.query.title };
                            // },
                            // 结构赋值
                            props({ query }) {
                                return { id: query.id, title: query.title };
                            },
                            // 连续结构赋值
                            // props({ query: { id, title } }) {
                            //     return { id, title };
                            // },
                        }
                    ]
                },
            ]
        },

    ]
});

// 全局前置路由守卫--初始化和每次路由切换之前调用
router.beforeEach((to, from, next) => {
    console.log('全局前置路由守卫');
    if (to.meta.isAuth) {
        if ('peiliyou' === sessionStorage.getItem('school')) {
            next();
        }
        return;
    }
    next();
});
//全局后置路由守卫-初始化和每次路由切换后调用
router.afterEach((to, from) => {
    console.log('全局后置路由守卫');
    document.title = from.name + ' - 来 - ' + to.name;
});

export default router;